<template>
  <el-dialog
    title="单位详情"
    :visible.sync="handleVisible"
    width="1080px"
    append-to-body
  >
    <el-form ref="form" :model="formUnit" label-width="150px">
      <el-row :gutter="15">
        <el-col :span="12">
          <el-form-item label="单位名称" prop="unitName">
            {{ formUnit.unitName }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="组织机构代码" prop="unitInstitutionId">
            {{ formUnit.unitInstitutionId }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="12">
          <el-form-item label="法定代表人" prop="unitRepresentative">
            {{ formUnit.unitRepresentative }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            label="法定代表人联系电话"
            prop="unitRepresentativePhone"
          >
            {{ formUnit.unitRepresentativePhone }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="12">
          <el-form-item label="联系人" prop="unitLinkman">
            {{ formUnit.unitLinkman }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="联系电话" prop="unitPhone">
            {{ formUnit.unitPhone }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="12">
          <el-form-item label="单位类型" prop="unitType">
            {{ formUnit.unitType }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="单位序号" prop="unitSort">
            {{ formUnit.unitSort }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="12">
          <el-form-item label="资质等级" prop="unitNaturalGrade">
            {{ formUnit.unitNaturalGrade }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="资质范围" prop="unitNaturalScope">
            {{ formUnit.unitNaturalScope }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="12">
          <el-form-item label="注册地址" prop="unitAddress">
            {{ formUnit.unitAddress }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="单位邮箱" prop="unitEmail">
            {{ formUnit.unitEmail }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15" v-show="doNotDisplay">
        <el-col :span="12">
          <el-form-item label="可中签次数" prop="unitNum">
            {{ formUnit.unitNum }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="备注" prop="unitRemarks">
            {{ formUnit.unitRemarks }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="12">
          <el-form-item label="是否注册在高新区" prop="whetherRegister">
            {{ formUnit.whetherRegister == 0 ? "是" : "否" }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="是否税收在高新区" prop="whetherRevenue">
            {{ formUnit.whetherRevenue == 0 ? "是" : "否" }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="12">
          <div style="margin-left: 25px">
            <el-button
              type="text"
              @click="
                () => {
                  handleProject(7);
                  title = '项目进行中';
                }
              "
              >进行中项目</el-button
            >
            <el-button
              type="text"
              @click="
                () => {
                  handleProject(8);
                  title = '已完成项目';
                }
              "
              >已完成项目</el-button
            >
          </div>
        </el-col>
      </el-row>
    </el-form>
    <Projects
      :visible.sync="projectVisible"
      :title="title"
      :projects="projects"
      :pagination.sync="pagination"
      @refresh="refresh"
    />
  </el-dialog>
</template>
  
  <script>
import Projects from "./components/projects";
import { getDeptExtractList } from "@/api/unit/random";

export default {
  name: "unitDetail",
  components: {
    Projects,
  },
  props: {
    formUnit: Object,
    visible: Boolean,
    doNotDisplay: {
      type: Boolean,
      default: true
    }
  },
  computed: {
    handleVisible: {
      get() {
        return this.visible;
      },
      set(value) {
        this.$emit("update:visible", value);
      },
    },
  },
  data() {
    return {
      projectVisible: false,
      title: "",
      projects: [],
      pagination: {
        pageNum: 1,
        pageSize: 10,
        total: 0,
      },
      randomBan: 7,
    };
  },
  methods: {
    handleProject(randomBan) {
      this.randomBan = randomBan;
      getDeptExtractList({
        randomUnitId: this.formUnit.unitId,
        pageNum: this.pagination.pageNum,
        pageSize: this.pagination.pageSize,
        randomBan,
      }).then((res) => {
        this.pagination.total = res.total;
        if (res.code == 200) {
          res.rows.forEach((item, index) => {
            item.index = index + 1;
            item.state = "中标";
          });
          this.projects = res.rows;
          this.projectVisible = true;
        }
      });
    },
    refresh() {
      this.handleProject(this.randomBan);
    },
  },
};
</script>
  
  <style scoped>
</style>
  